/**
 * Created by 1 on 2016/12/9.
 */
var $ = function (element) {
    return document.querySelector(element);
}

/**
 * 获取当前时间并转换格式
 * @returns {string}
 */
function getTime() {
    var date = new Date();
    //将日期转换为相应的格式，并返回字符串形式(原来返回的为number格式)
    var year = ("0000"+ date.getFullYear()).substr(-4);
    var month = ("00" + (date.getMonth() + 1)).substr(-2);
    var day = ("00" + date.getDay()).substr(-2);
    var hour = ("00" + date.getHours()).substr(-2);
    var minute = ("00" + date.getMinutes()).substr(-2);
    var second = ("00" + date.getSeconds()).substr(-2);
    var millisecond = ("000" + date.getMilliseconds()).substr(-3);
    // console.log(year);
    // console.log(date.getFullYear());//2016
    // console.log(month);
    // console.log(date.getMonth());//11
    // console.log(day);
    // console.log(date.getDay());//5
    // console.log(hour);
    // console.log(date.getHours());//15
    // console.log(minute);
    // console.log(date.getMinutes());//53
    // console.log(second);
    // console.log(date.getSeconds());//6
    // console.log(millisecond);
    return year + "-" + month + "-" + day + " " + hour + ":" + minute + ":" + second + ":" + millisecond;
}
// getTime();
var consoleText = $("#console-text");
// alert(consoleText);
/**
 * 控制台输出
 * @param message 信息
 * @param color 颜色
 */
function log(message, color) {
    var date = new Date();
    var p = document.createElement("p");
    p.innerHTML = getTime() + " ";
    var span = document.createElement("span");
    span.innerHTML = message;
    span.style.color = color;
    p.appendChild(span);
    consoleText.appendChild(p);
    console.log("%c" + message,"background-color:" + color);
    consoleText.scrollTop = consoleText.scrollHeight;//设置其滚动的高度一直在下
}
/**
 * 操作面板拖动
 */
(function () {
        //获取对象元素
        var control = $("#control");
        var title = $("#control-title");
        //设置初始位置
        control.style.top = 0;
        control.style.left = 0;
        var draggingControl = false;//拖动标记
        var start = [0,0];//开始位置
        var positon = [ //保存移动位置信息
            control.style.left.substr(0,control.style.left.length - 2) - 0,
            control.style.top.substr(0,control.style.top.length - 2) - 0
        ];
        //绑定事件
        title.addEventListener("mousedown",function (e) {//鼠标按下事件
            start[0] = e.clientX - positon[0];//保存鼠标按下时候鼠标点击位置在title中的位置
            start[1] = e.clientY - positon[1];
            console.log("The start position is:" + start);
            draggingControl = true;
        });
        addEventListener("mouseup",function () {//鼠标抬起事件
            draggingControl = false;
        });
        addEventListener("mousemove",function (e) {
            if (draggingControl){//判断鼠标是否按下
                positon[0] = e.clientX - start[0] ;//整个区域的位置即为鼠标点击的位置减去鼠标开始时在title中的偏移位置
                positon[1] = e.clientY - start[1] ;
                console.log("The position is:" + positon);
                if(positon[0] > window.innerWidth - control.offsetWidth){
                    positon[0] = window.innerWidth - control.offsetWidth;
                }
                if(positon[0] < 0){
                    positon[0] = 0;
                }
                if (positon[1] > window.innerHeight - control.offsetHeight){
                    positon[1] = window.innerHeight - control.offsetHeight;
                }
                if (positon[1] < 0){
                    positon[1] = 0;
                }
                control.style.left = positon[0] + "px";
                control.style.top = positon[1] + "px";
            }
        });
    }
)();//闭包

(function () {
    var consoleDiv = $("#console");
    var title = $("#console-title");
    console.log("The offsetHeight is" + consoleDiv.offsetHeight );//200
    console.log("The offsetWight is" + consoleDiv.offsetWidth);//500
    consoleDiv.style.top = (window.innerHeight - consoleDiv.offsetHeight) +"px";
    consoleDiv.style.left = (window.innerWidth - consoleDiv.offsetWidth) + "px";
    var isDrag = false;
    var start = [0,0];
    console.log(window.innerWidth);//1242
    console.log(window.innerHeight);//593
    console.log(consoleDiv.style.left);//742
    console.log(consoleDiv.style.top);//393
    console.log(consoleDiv.style.left.length );//5
    var position = [//当前位置,将其长度截取为3个字符串
        consoleDiv.style.left.substr(0,consoleDiv.style.left.length - 2) - 0,
        consoleDiv.style.top.substr(0,consoleDiv.style.top.length - 2) - 0
    ];
    console.log(position);//742,393
    //绑定事件
    title.addEventListener("mousedown",function (e) {
        start[0] = e.clientX - position[0];//鼠标点击的位置在区域中的相对位置
        start[1] = e.clientY - position[1];
        console.log("鼠标位置" + e.clientX + e.clientY);
        console.log(position);
        console.log("The start is" + start);
        isDrag = true;
    });
    addEventListener("mouseup",function () {
        isDrag = false;
    });
    addEventListener("mousemove",function (e) {
        if (isDrag){
            position[0] = e.clientX - start[0];
            position[1] = e.clientY - start[1];
            if(position[0] > window.innerWidth - consoleDiv.offsetWidth) {
                position[0] = window.innerWidth - consoleDiv.offsetWidth;
            }
            if(position[0] < 0) {
                position[0] = 0;
            }
            if(position[1] > window.innerHeight - consoleDiv.offsetHeight) {
                position[1] = window.innerHeight - consoleDiv.offsetHeight;
            }
            if(position[1] < 0) {
                position[1] = 0;
            }
            consoleDiv.style.left = position[0] + "px";
            consoleDiv.style.top = position[1] + "px";
        }
    });
})();

(
    function () {
        var buttonClick = function () {
            var orbit = this.parentNode.dataset.id - 0;
            var message = this.dataset.type;
            switch (message){
                case "create":
                    if(this.dataset.status == 'create'){

                    }
            }

        }
        var buttons = document.getElementsByTagName("button");
        for(var i = 0;buttons.length;i++){
            buttons[i].addEventListener("click",buttonClick);
        }
    }
)();